<template>
<div>
    <el-form :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="method==='view'"
             label-width="120px">
      <el-row  :gutter="15">
        <el-col :span="12">
            <el-form-item label="设备名称" prop="equipmentName"
                :rules="[
                 ]">
              <el-input v-model="inputForm.equipmentName" placeholder="请填写设备名称"     ></el-input>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="部件名称" prop="codeAndName"
                :rules="[
                 ]">
              <el-input v-model="inputForm.codeAndName" placeholder="请填写部件名称"     ></el-input>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="零件名称" prop="idname"
                :rules="[
                 ]">
              <el-input v-model="inputForm.idname" placeholder="请填写零件名称"     ></el-input>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="项目" prop="project"
                :rules="[
                 ]">
              <el-input v-model="inputForm.project" placeholder="请填写项目"     ></el-input>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="点检内容" prop="checkContent"
                :rules="[
                 ]">
              <el-input v-model="inputForm.checkContent" placeholder="请填写点检内容"     ></el-input>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="设备状态" prop="equipment"
                :rules="[
                 ]">
                    <el-radio-group v-model="inputForm.equipment">
                        <el-radio v-for="item in $dictUtils.getDictList('basicdata_part_device_node_running_state')" :label="item.value" :key="item.id">{{item.label}}</el-radio>
                    </el-radio-group>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="点检分工" prop="checkWork"
                :rules="[
                 ]">
                <el-checkbox-group v-model="inputForm.checkWork" >
                    <el-checkbox-button v-for="checkWork in $dictUtils.getDictList('check_job')"  :label="checkWork.value" :key="checkWork.id">{{checkWork.label}}</el-checkbox-button>
                </el-checkbox-group>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="点检责任人" prop="checkUser.id"
                :rules="[
                 ]">
                <user-select :limit='1' :value="inputForm.checkUser.id" @getValue='(value) => {inputForm.checkUser.id=value}'></user-select>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="检修责任人" prop="overhaulUser.id"
                :rules="[
                 ]">
                <user-select :limit='1' :value="inputForm.overhaulUser.id" @getValue='(value) => {inputForm.overhaulUser.id=value}'></user-select>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="岗位责任人" prop="postStartTime.id"
                :rules="[
                 ]">
                <user-select :limit='1' :value="inputForm.postStartTime.id" @getValue='(value) => {inputForm.postStartTime.id=value}'></user-select>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="点检方法" prop="checkMethod"
                :rules="[
                 ]">
                <el-checkbox-group
                          v-model="inputForm.checkMethod">
                         <el-checkbox-button v-for="checkMethod in $dictUtils.getDictList('check_method')" :label="checkMethod.value" :key="checkMethod.id">{{checkMethod.label}}</el-checkbox-button>
                </el-checkbox-group></el-form-item>
           </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item label="备注信息" prop="remarks"
                :rules="[
                 ]">
          <el-input type="textarea" v-model="inputForm.remarks" placeholder="请填写备注信息"     ></el-input>
           </el-form-item>
        </el-col>
    <el-col :span="24">
     <el-form-item label-width="0">
            <el-tabs v-model="checkStandardCycleTab">
            <el-tab-pane label="周期点检子表">
                  <!-- <el-button size="small" @click="addCheckStandArdCycleChildRow" type="primary">新增</el-button> -->
                  <el-table
                  border
                  :data="inputForm.checkStandArdCycleChildList.filter(function(item){ return item.delFlag !== '1'})"
                  style="width: 100%">
                <!-- <el-table-column
                    prop="checkName"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="内容">
                  </el-table-column> -->
                  <el-table-column
                      prop="name"
                      header-align="center"
                      align="center"
                      show-overflow-tooltip
                      label="指标名称">
                    </el-table-column>
                <el-table-column
                    prop="checkCategory"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="类别">
                    <template slot-scope="scope">
                        {{ $dictUtils.getDictLabel("basicdata_category", scope.row.checkCategory, '-') }}
                    </template>
                  </el-table-column>
                <el-table-column
                    prop="checkUnit"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="计量单位">
                    <template slot-scope="scope">
                        {{ $dictUtils.getDictLabel("basicdata_symbol_measure", scope.row.checkUnit, '-') }}
                    </template>
                  </el-table-column>
                <el-table-column
                    prop="checkJudgeSymbol"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="判断符号">
                    <template slot-scope="scope">
                        {{ $dictUtils.getDictLabel("basicdata_symbol", scope.row.checkJudgeSymbol, '-') }}
                    </template>
                  </el-table-column>
                <el-table-column
                    prop="checkDownJudgeSymbol"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="下限判断符号">
                    <template slot-scope="scope">
                        {{ $dictUtils.getDictLabel("basicdata_symbol", scope.row.checkDownJudgeSymbol, '-') }}
                    </template>
                  </el-table-column>
                <el-table-column
                    prop="checkUp"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="上限">
                  </el-table-column>
                <el-table-column
                    prop="checkLimit"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="上极限">
                  </el-table-column>
                  <el-table-column
                      prop="checkDown"
                      header-align="center"
                      align="center"
                      show-overflow-tooltip
                      label="下限">
                    </el-table-column>
                  <el-table-column
                      prop="checkDownLimit"
                      header-align="center"
                      align="center"
                      show-overflow-tooltip
                      label="下极限">
                    </el-table-column>
                  <el-table-column
                      prop="isnormal"
                      header-align="center"
                      align="center"
                      show-overflow-tooltip
                      label="是否异常">
                      <template slot-scope="scope">
                          {{ $dictUtils.getDictLabel('yes_no', scope.row.isnormal, '-') }}
                      </template>
                    </el-table-column>
                 <el-table-column
                     prop="abnormalLevel"
                     header-align="center"
                     align="center"
                     show-overflow-tooltip
                     label="异常等级">
                     <template slot-scope="scope">
                         {{ $dictUtils.getDictLabel('abnormal_level', scope.row.abnormalLevel, '-') }}
                     </template>
                   </el-table-column>
                <el-table-column
                    prop="checkJudge"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="是否手动">
                    <template slot-scope="scope">
                        {{ $dictUtils.getDictLabel("true_false", scope.row.checkJudge, '-') }}
                    </template>
                  </el-table-column>
                  <!-- <el-table-column
                    prop="checkPeople.name"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="责任人">
                  </el-table-column>
                  <el-table-column
                    prop="user.name"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="点检责任人">
                  </el-table-column> -->
                <el-table-column
                    prop="checkContent"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="点检标准">
                  </el-table-column>
                <el-table-column
                    prop="input"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="输入">
                  </el-table-column>
                <el-table-column
                    prop="remarks"
                    header-align="center"
                    align="center"
                    show-overflow-tooltip
                    label="备注信息">
                  </el-table-column>
                  <el-table-column
                    fixed="right"
                    label="操作"
                    width="150">
                    <template slot-scope="scope">
                      <el-button @click="viewCheckStandArdCycleChildRow(scope.row)" type="text" size="small">查看</el-button>
                      <el-button  @click="editCheckStandArdCycleChildRow(scope.row)" type="text" size="small">编辑</el-button>
                      <el-button  @click="delCheckStandArdCycleChildRow(scope.row)" type="text" size="small">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
            </el-tabs>
           </el-form-item>
          </el-col>
        </el-row>
    </el-form>
  <CheckStandArdCycleChildForm ref="checkStandArdCycleChildForm" @addRow="saveCheckStandArdCycleChildRow(arguments)" @theId="theId(arguments)"></CheckStandArdCycleChildForm>
</div>
</template>

<script>
  import CheckStandArdCycleChildForm from './CheckStandArdCycleChildForm'
  import UserSelect from '@/components/userSelect'
  export default {
    data () {
      return {
        title: '',
        method: '',
        visible: false,
        loading: false,
        checkStandardCycleTab: '0',
        inputForm: {
          id: '',
          partdeviceid: '',
          checkDownLimit: '',
          checkDown: '',
          checkStandArdCycleChildList: [],
          equipmentName: '',
          partsName: '',
          sparePartsName: '',
          project: '',
          checkContent: '',
          equipment: '',
          idname: '',
          checkWork: [],
          checkUser: {
            id: ''
          },
          overhaulUser: {
            id: ''
          },
          postStartTime: {
            id: ''
          },
          checkMethod: [],
          remarks: '',
          codeAndName: ''
        }
      }
    },
    props: {
      businessId: {
        type: String,
        default: ''
      },
      formReadOnly: {
        type: Boolean,
        default: false
      }
    },
    components: {
      UserSelect,
      CheckStandArdCycleChildForm
    },
    watch: {
      'businessId': {
        handler (newVal) {
          if (this.businessId) {
            this.init(this.businessId)
          } else {
            this.$nextTick(() => {
              this.$refs.inputForm.resetFields()
            })
          }
        },
        immediate: true,
        deep: false
      }
    },
    methods: {
      theId (id) {
        console.log(id)
        this.$emit('theId', id[0])
      },
      init (id) {
        if (id) {
          this.loading = true
          this.inputForm.id = id
          this.$nextTick(() => {
            this.$refs.inputForm.resetFields()
            this.$http({
              url: `/check/checkstandardcycle/checkStandardCycle/queryById?id=${this.inputForm.id}`,
              method: 'get'
            }).then(({data}) => {
              this.inputForm = this.recover(this.inputForm, data.checkStandardCycle)
              this.$emit('check', this.inputForm)
              // this.$refs.checkStandArdCycleChildForm = this.checkStandArdCycleChildList
              this.loading = false
            })
          })
        }
      },
      saveCheckStandArdCycleChildRow (child) {
        if (child[0] === '') {
          this.inputForm.checkStandArdCycleChildList.push(child[1])
        } else {
          this.inputForm.checkStandArdCycleChildList.forEach((item, index) => {
            if (item === child[0]) {
              this.inputForm.checkStandArdCycleChildList.splice(index, 1, child[1])
            }
          })
        }
      },
      addCheckStandArdCycleChildRow (child) {
        this.$refs.checkStandArdCycleChildForm.init('add')
      },
      viewCheckStandArdCycleChildRow (child) {
        this.$refs.checkStandArdCycleChildForm.init('view', child)
      },
      editCheckStandArdCycleChildRow (child) {
        this.$refs.checkStandArdCycleChildForm.init('edit', child)
      },
      delCheckStandArdCycleChildRow (child) {
        this.inputForm.checkStandArdCycleChildList.forEach((item, index) => {
          if (item === child && item.id === '') {
            this.inputForm.checkStandArdCycleChildList.splice(index, 1)
          } else if (item === child) {
            item.delFlag = '1'
            this.inputForm.checkStandArdCycleChildList.splice(index, 1, item)
          }
        })
      },

      saveForm (callback) {
        this.$refs['inputForm'].validate((valid) => {
          if (valid) {
            this.loading = true
            this.$http({
              url: `/check/checkstandardcycle/checkStandardCycle/save`,
              method: 'post',
              data: this.inputForm
            }).then(({data}) => {
              if (data && data.success) {
                callback(data.businessTable, data.businessId)
              }
            })
          }
        })
      }

      // 表单提交
      // doSubmit () {
      //   this.$refs['inputForm'].validate((valid) => {
      //     if (valid) {
      //       this.loading = true
      //       this.$http({
      //         url: `/check/checkstandardcycle/checkStandardCycle/save`,
      //         method: 'post',
      //         data: this.inputForm
      //       }).then(({data}) => {
      //         this.loading = false
      //         if (data && data.success) {
      //           this.visible = false
      //           this.$message.success(data.msg)
      //           this.$emit('refreshDataList')
      //         }
      //       })
      //     }
      //   })
      // }
    }
  }
</script>
